<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="/WEB-INF/views/wx/include/head.jsp" %>
<style>
body,.mui-content{background-color:#ffffff;}
.mui-table-view-cell:after {left: 0px;}
.mui-table-cell{font-size:14px !important;}
.mui-col-xs-3{position:relative;}
.input-span {position:absolute;top:10px;right:5px;font-size:12px;color:rgba(0,0,0,.3);}
.grid-input{width:100% !important;padding:10px !important;margin:0px !important;font-size:12px;margin-right:2px !important;}
.span2{padding-right:29px !important;}
.span1{padding-right:18px !important;}
.span3{padding-right:32px !important;}
.span4{padding-right:42px !important;}
li,li.mui-active{background-color:#ffffff !important;}
.title{font-weight:bold;text-align:center;}
input:disabled{background-color:rgba(0,0,0,.1);}
</style>
</head>
<body>
	<header class="mui-bar mui-bar-nav">
		<a href="${ctxWx}/d/realschevehi/todayList" class="mui-icon mui-icon-left-nav mui-pull-left"></a>
		<h1 class="mui-title">包车结算</h1>
	</header>
	<form id="settleForm" action="${ctxWx}/d/realschevehi/saveSettle" method="post">
		<input type="hidden" name="realvehiid" value=${realscheVehi.realvehiid } />
		<div class="mui-content">
			<div class="mui-content-padded">
				<p>到达目的地时间：2016-11-30 15:20:03</p>
			</div>
			<ul class="mui-table-view">
				<li class="mui-table-view-cell">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3 title">项目</div>
						<div class="mui-table-cell mui-col-xs-3 title">单价</div>
						<div class="mui-table-cell mui-col-xs-3 title">数量</div>
						<div class="mui-table-cell mui-col-xs-3 title">小结</div>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3 mui-ellipsis">超时长</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元/h</span>
							<input name="timescale" class="double grid-input span2" type="text" value="100"/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">时</span>
							<input name="outtime" class="integer grid-input span1" type="text" value=""/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元</span>
							<input name="outtimefee" class="double grid-input span1" type="text" value=""/>
						</div>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3 mui-ellipsis">超公里数</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元/km</span>
							<input name="kmscale" class="double grid-input span3" type="text" value="100"/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">公里</span>
							<input name="outkms" class="integer grid-input span2" type="text" value=""/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元</span>
							<input name="outkmsfee" class="double grid-input span1" type="text" value=""/>
						</div>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3 mui-ellipsis">空驶</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元/km</span>
							<input name="emptyscale" class="double grid-input span3" type="text" value="100"/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">公里</span>
							<input name="emptykms" class="integer grid-input span2" type="text" value=""/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元</span>
							<input name="emptyfee" class="double grid-input span1" type="text" value=""/>
						</div>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<p class="mui-h6" style="text-align:center;margin-bottom:10px;">司机费用</p>
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3 mui-ellipsis">住宿</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span" style="font-size:8px !important;">元/晚/人</span>
							<input name="restfeescale" class="double grid-input span3" type="text" value="100"/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">晚</span>
							<input name="restdays" class="integer grid-input span1" type="text" value=""/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元</span>
							<input name="restfee" class="double grid-input span1" type="text" value=""/>
						</div>
					</div>
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3"></div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">人</span>
							<input class="integer grid-input span1" type="text" value=""/>
						</div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
					</div>
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3 mui-ellipsis">餐饮</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span" style="font-size:8px !important;">元/天/人</span>
							<input name="dietfeescale" class="double grid-input span3" type="text" value="100"/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">天</span>
							<input name="dietdays" class="integer grid-input span1" type="text" value=""/>
						</div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元</span>
							<input name="dietfee" class="double grid-input span1" type="text" value=""/>
						</div>
					</div>
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3"></div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">人</span>
							<input class="integer grid-input span1" type="text" value=""/>
						</div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3 mui-ellipsis">第三方</div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元</span>
							<input name="thirdfee" class="double grid-input span1" type="text" value=""/>
						</div>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<p class="mui-h6" style="text-align:center;margin-bottom:10px;">总计</p>
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3 mui-ellipsis">应收金额</div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元</span>
							<input class="grid-input span1" type="text" value="" disabled/>
						</div>
					</div>
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-3 mui-ellipsis">实收金额</div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
						<div class="mui-table-cell mui-col-xs-3"><input class="grid-input" type="text" disabled/></div>
						<div class="mui-table-cell mui-col-xs-3">
							<span class="input-span">元</span>
							<input id="totaladdfee" name="totaladdfee" class="double grid-input span1" type="text" value=""/>
						</div>
					</div>
				</li>
			</ul>
			<div class="mui-content-padded" style="padding-bottom:20px !important;">
				<button type="button" class="mui-btn mui-btn-primary mui-btn-block" onclick="check()">结算</button>
			</div>
		</div>
	</form>
	<%@ include file="/WEB-INF/views/wx/include/script.jsp"%>
	<script>
		function check(){
			var msg = '';
			var integer = /^[0-9]*[1-9][0-9]*$/; 
			var money=/^[0-9]*(\.[0-9]{1,2})?$/;
			$('.integer').each(function(){
				var val = $(this).val();
				if(val!='' && !integer.test(val)) {
					$(this).focus();
					msg = '请填写整数（不包括0）';
					return;
				}
			});
			$('.double').each(function(){
				var val = $(this).val();
				if(val!='' && !money.test(val)) {
					$(this).focus();
					msg = '请填写金额（如0.01）';
					return;
				}
			});
			if($('#totaladdfee').val()==''){
				msg = '请填写实收金额';
			}
			if(msg == ''){
				$('#settleForm').submit();
			} else {
				mui.alert(msg);
			}
		}
	</script>
</body>
</html>